<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>全选操作</title>
    <script>
        function fn(){
            let all = document.getElementById("all");
            let emps = document.getElementsByName("emp");
            for(let i = 0; i < emps.length; i++){
                emps[i].checked = all.checked;
            }
        }
    </script>
</head>
<body>
<table border="1">
    <!--
        全选操作
            当用户点击全选时,表格中所有的多选框均发生变化
            最终所有的多选框均与全选的多选框一致
            全选的多选框如果是选中状态,其他多选框均为选中状态
            全选的多选框如果是未选中状态,其他多选框均为未选中状态
    -->
    <tr>
        <th><input type="checkbox" id="all" onclick="fn()"/>全选</th>
        <th>编号</th>
        <th>姓名</th>
        <th>工资</th>
        <th>操作</th>
    </tr>
    <tr>
        <td><input name="emp" type="checkbox"/></td>
        <td>1</td>
        <td>admin</td>
        <td>5000</td>
        <td>
            <a href="">修改</a>
            <a href="">删除</a>
        </td>
    </tr>
    <tr>
        <td><input name="emp" type="checkbox"/></td>
        <td>2</td>
        <td>alice</td>
        <td>5000</td>
        <td>
            <a href="">修改</a>
            <a href="">删除</a>
        </td>
    </tr>
    <tr>
        <td><input name="emp" type="checkbox"/></td>
        <td>3</td>
        <td>jack</td>
        <td>5000</td>
        <td>
            <a href="">修改</a>
            <a href="">删除</a>
        </td>
    </tr>
</table>
</body>
</html>